<template>
  <el-dialog :visible.sync="showDialog" :close-on-click-modal="false" width="80%" append-to-body :title="showTitle">

    <div class="page-content">
      <el-table :key="0" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
        <el-table-column label="ID" align="center" width="100">
          <template slot-scope="{ row }">
            {{ row.mid_table_remark_007 }}
          </template>
        </el-table-column>
        <el-table-column label="查询条件" align="center">
          <template slot-scope="{ row }">
            <el-popover placement="left" width="200" trigger="click">
              <div class="popover-box">
                <div class="cont-item" v-html="row.show_mid_table_remark_001"></div>
              </div>
              <div class="table-cell-overflow" slot="reference">{{ row.show_mid_table_remark_001 | showBRContent }}</div>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="查询结果" align="center">
          <template slot-scope="{ row }">
            <el-popover placement="left" width="600" trigger="click">
              <div class="popover-box nowrap">
                <pre class="cont-item" v-html="row.show_mid_table_remark_002"></pre>
              </div>
              <div class="table-cell-overflow" slot="reference">{{ row.show_mid_table_remark_002 | showBRContent }}</div>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="查询时间" align="center" width="160" :resizable="false">
          <template slot-scope="{ row }">
            {{ row.time_insert }}
          </template>
        </el-table-column>
        <el-table-column label="评价等级" align="center" width="110" :resizable="false">
          <template slot-scope="{ row }">
            <!-- {{ row.mid_table_remark_018 }} -->
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="110" :resizable="false">
          <template slot-scope="{ row }">
            <el-button type="text" @click="handleModify(row)">修改结果</el-button>
          </template>
        </el-table-column>

      </el-table>
    </div>
    <!-- <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="currentPage"
      :limit.sync="listQuery.limit"
      @pagination="getPageList"
    /> -->
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">关闭</el-button>
      <!-- <el-button type="primary" @click="handleRecordClassic">收录为经典</el-button> -->
    </div>
    <comp-modify-chat ref="refModifyChat" @refresh="onRefresh"></comp-modify-chat>
  </el-dialog>
</template>
<script>
import { Base64 } from "js-base64";
import { middleList } from "@/api/middle";
import Pagination from "@/components/Pagination";
import CompModifyChat from "./modify_chat.vue"
export default {
  name: "CompChatDetailClassic",
  components: {
    Pagination,
    CompModifyChat
  },
  data() {
    return {
      showTitle: "",
      showDialog: false,
      list: [],
      listLoading: false,
      rowInfo: null,
      industryInfo: null
    }
  },
  filters: {
    showBRContent(val) {
      if (!val) { return val }
      return val.replace(/<br\s*\/?>/g, "\n")
    },
    showRuleContent(val) {
      try {
        let result = Base64.decode(val);
        return result;
      } catch (error) {
        return val;
      }
    },
  },
  methods: {
    async onShowDialog(row, industryInfo) {

      if (!row || !row.mid_table_remark_013 || !industryInfo) {
        return;
      }
      this.rowInfo = row;
      this.industryInfo = industryInfo
      this.showTitle = row?.mid_table_remark_013 || "";

      await this.getList();
      this.showDialog = true;
    },
    async getList() {

      let response = await middleList(
        this.Qs.stringify({
          invoke_method: "public_load_middle_table_list",
          pre_db_para_middle_table_name:
            "public_middle_table_lite_mod_ai_chatgpt",
          type_middle_app: 30001,
          type_inner_app: 1001,
          is_online: 0,
          mid_table_remark_008: this.rowInfo.mid_table_remark_008,
          mid_table_remark_013_in: this.rowInfo.mid_table_remark_013,
        })
      ).catch((err) => { });
      if (response) {
        let result = response.page_content || [];
        for (let i = 0; i < result.length; i++) {
          let item = result[i];
          item.show_mid_table_remark_001 = item.mid_table_remark_001;
          try {
            if (item.mid_table_remark_001) {
              item.show_mid_table_remark_001 = Base64.decode(item.mid_table_remark_001)
            }
            if (item.mid_table_remark_002) {
              item.show_mid_table_remark_002 = Base64.decode(item.mid_table_remark_002)
            }
          } catch (error) {
          }
        }
        this.list = result;

      }
    },
    handleClose() {
      this.showDialog = false
    },
    onRefresh() {
      this.showDialog=false;
      this.$emit('refresh')
      // this.getList()
    },
    async handleModify(row) {
      let tmpRow = Object.assign({}, this.industryInfo, row);
      this.$refs.refModifyChat.onEditOrAdd(tmpRow)
      return;
    }
  }
}
</script>
<style lang="scss">
@import "../../../styles/common.scss";
</style>
